import 'package:enterprise_v6_app/app/components/custom_app_bar.dart';
import 'package:enterprise_v6_app/app/components/custom_progress.dart';
import 'package:enterprise_v6_app/app/core/core.dart';
import 'package:enterprise_v6_app/app/core/ext/widget_extension.dart';
import 'package:enterprise_v6_app/app/core/utils/interface.dart';
import 'package:enterprise_v6_app/app/modules/application/education/course_center/integrated_theme/course_detail_detail_page/course_detail/course_detail_controller.dart';
import 'package:enterprise_v6_app/app/modules/application/education/course_center/integrated_theme/course_detail_detail_page/course_detail/evaluate/evaluate_view.dart';
import 'package:enterprise_v6_app/app/modules/application/education/course_center/integrated_theme/course_detail_detail_page/course_detail/train_directory/train_directory_view.dart';
import 'package:enterprise_v6_app/app/modules/application/education/course_center/integrated_theme/course_detail_detail_page/course_detail/train_introduction/train_introduction_view.dart';

///课程详情
class CourseDetailPage extends StatelessWidget {
  CourseDetailPage({super.key});

  final controller = Get.put(CourseDetailController());

  @override
  Widget build(BuildContext context) {
    return GetBuilder(
        init: controller,
        builder: (_) {
          return Scaffold(
            resizeToAvoidBottomInset: false,
            backgroundColor: AppColors.bg_color_grey,
            appBar: CustomAppBar(
              titleText: '课程详情',
            ),
            body: DefaultTabController(
              length: 3,
              initialIndex: controller.initPage,
              child: PrimaryScrollController(
                controller: controller.myScrollController,
                child: NestedScrollView(
                  headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
                    return <Widget>[
                      SliverList(
                        delegate: SliverChildBuilderDelegate(
                          (BuildContext context, int index) {
                            return _headInfo();
                          },
                          childCount: 1,
                        ),
                      ),
                      SliverList(
                        delegate: SliverChildBuilderDelegate(
                          (BuildContext context, int index) {
                            return Visibility(
                                visible: controller.getEducationPlanEntity != null && controller.getEducationPlanEntity!.isNotEmpty, child: _trainPlanCount());
                          },
                          childCount: 1,
                        ),
                      ),
                      //吸收高度
                      SliverOverlapAbsorber(
                        handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
                        sliver: SliverPersistentHeader(
                          pinned: true,
                          delegate: StickyHeader(
                            Obx(() => Container(
                                  color: Colors.white,
                                  child: TabBar(
                                    enableFeedback: false,
                                    tabs: [
                                      const Tab(text: '课程介绍'),
                                      const Tab(text: '课程目录'),
                                      Tab(text: '评价(${controller.courseDetailEvaluateCount})'),
                                    ],
                                    dividerColor: const Color(0xFFECEEF3),
                                    labelPadding: EdgeInsets.only(bottom: 10.w),
                                    labelStyle: TextStyle(
                                      fontSize: 16.sp,
                                      fontWeight: FontWeight.w400,
                                    ),
                                    unselectedLabelStyle: TextStyle(
                                      fontSize: 16.sp,
                                      fontWeight: FontWeight.w400,
                                    ),
                                    labelColor: const Color(0xFF5C6DFF),
                                    unselectedLabelColor: const Color(0xFF262F38),
                                    indicatorPadding: EdgeInsets.only(top: 45.w, bottom: 0.w, right: 20, left: 20),
                                    indicator: const BoxDecoration(
                                      gradient: LinearGradient(begin: Alignment.topLeft, end: Alignment.bottomRight, colors: [
                                        Color(0xFF5C6DFF),
                                        Color(0xFF5C6DFF),
                                      ]),
                                    ),
                                  ),
                                )),
                          ),
                        ),
                      ),
                    ];
                  },
                  body: Container(
                    padding: EdgeInsets.only(top: 45.w),
                    color: const Color(0xffF5F5F6),
                    child: TabBarView(
                      children: [
                        TrainIntroductionPage(),
                        TrainDirectoryPage(),
                        EvaluatePage(),
                      ],
                    ),
                  ),
                ),
              ),
            ),

            bottomSheet: Container(
              height: 50.w,
              alignment: Alignment.center,
              padding: EdgeInsets.symmetric(horizontal: 16.w),
              decoration: BoxDecoration(
                color: Colors.white,
                boxShadow: [
                  BoxShadow(
                    color: const Color(0xffBCBCC5).withOpacity(0.3), // 阴影颜色
                    offset: const Offset(0, -5), // 阴影的偏移量，向上偏移，即上方阴影
                    blurRadius: 10.0, // 阴影的模糊半径
                    spreadRadius: 2.0, // 阴影的扩散半径
                  ),
                ],
              ),
              child: Container(
                  height: 40.w,
                  alignment: Alignment.center,
                  decoration: BoxDecoration(
                      color: const Color(0xff5C6DFF),
                      borderRadius: BorderRadius.all(
                        Radius.circular(20.w),
                      )),
                  child: Text(
                    '进入学习',
                    style: TextStyle(
                      fontSize: 16.sp,
                      color: const Color(0xffffffff),
                    ),
                  )).clickOnce(controller.confirm),
            ), // 栏
          );
        });
  }

  Widget _headInfo() {
    return Container(
      margin: EdgeInsets.only(bottom: 16.w),
      color: Colors.white,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          controller.textbookDetailEntity?.textbookCover == null
              ? Container(
                  height: 175.w,
                )
              : Container(
                  height: 175.w,
                  decoration: BoxDecoration(
                      image: DecorationImage(
                    image: NetworkImage('${Interface.fileUrl}${controller.textbookDetailEntity?.textbookCover}'),
                  )),
                ).clickShowLarge(url: '${controller.textbookDetailEntity?.textbookCover}'),
          Padding(
            padding: EdgeInsets.only(top: 12.w, left: 16.w, bottom: 8.w),
            child: Text(
              controller.textbookDetailEntity?.textbookName ?? '',
              style: TextStyle(
                color: const Color(0xFF262F38),
                fontSize: 16.sp,
                fontWeight: FontWeight.w400,
              ),
            ),
          ),
          Row(
            children: [
              controller.textbookDetailEntity?.textbookForm == 0
                  ? Container(
                      margin: EdgeInsets.only(left: 16.w),
                      padding: EdgeInsets.symmetric(vertical: 2.w, horizontal: 7.w),
                      decoration: BoxDecoration(
                        color: const Color(0x1A5C6DFF),
                        borderRadius: BorderRadius.circular(4.w),
                      ),
                      child: Text(
                        '录播课',
                        style: TextStyle(
                          color: const Color(0xFF5C6DFF),
                          fontWeight: FontWeight.w400,
                          fontSize: 12.sp,
                        ),
                      ),
                    )
                  : Container(
                      margin: EdgeInsets.only(left: 12.w),
                      padding: EdgeInsets.symmetric(vertical: 2.w, horizontal: 7.w),
                      decoration: BoxDecoration(
                        color: const Color(0x1A33A9FF),
                        borderRadius: BorderRadius.circular(4.w),
                      ),
                      child: Text(
                        '课件',
                        style: TextStyle(
                          color: const Color(0xFF33A9FF),
                          fontWeight: FontWeight.w400,
                          fontSize: 12.sp,
                        ),
                      ),
                    ),
              const Spacer(),
              Row(
                children: [
                  Row(
                    children: [
                      SvgPicture.asset(
                        AppImages.icon_course_clock,
                      ),
                      AppGaps.hGap4,
                      Text(
                        '学时数：',
                        style: TextStyle(
                          color: const Color(0xFFA5A6B5),
                          fontWeight: FontWeight.w400,
                          fontSize: 12.sp,
                        ),
                      ),
                      Text(
                        '${controller.textbookDetailEntity?.textbookApproAch ?? ''}',
                        style: TextStyle(
                          color: const Color(0xFF495061),
                          fontSize: 12.sp,
                          fontWeight: FontWeight.w400,
                        ),
                      )
                    ],
                  ),
                  AppGaps.hGap10,
                  _divider(),
                  AppGaps.hGap10,
                  Row(
                    children: [
                      SvgPicture.asset(
                        AppImages.icon_course_eye,
                      ),
                      AppGaps.hGap4,
                      Text(
                        '已学：',
                        style: TextStyle(
                          color: const Color(0xFFA5A6B5),
                          fontWeight: FontWeight.w400,
                          fontSize: 12.sp,
                        ),
                      ),
                      Text(
                        '${controller.textbookDetailEntity?.viewNumber ?? '0'}',
                        style: TextStyle(
                          color: const Color(0xFF495061),
                          fontSize: 12.sp,
                          fontWeight: FontWeight.w400,
                        ),
                      )
                    ],
                  ),
                  AppGaps.hGap16,
                ],
              ),
            ],
          ),
          AppGaps.vGap16,
        ],
      ),
    );
  }

  ///分割线
  Widget _divider() {
    return Container(
      width: 2.w,
      height: 10.w,
      decoration: const BoxDecoration(
          gradient: LinearGradient(begin: Alignment.topCenter, end: Alignment.bottomCenter, colors: [
        Color(0xFFD8D8D8),
        Color(0xFFD8D8D8),
      ])),
    );
  }

  Widget _trainPlanCount() {
    return Container(
      padding: EdgeInsets.only(left: 16.w, top: 12.w, right: 16.w, bottom: 14.w),
      color: Colors.white,
      child: Column(
        children: [
          Row(
            children: [
              Text(
                '${controller.planName}',
                style: TextStyle(
                  color: const Color(0xFF262F38),
                  fontSize: 14.sp,
                  fontWeight: FontWeight.w400,
                ),
              ),
              AppGaps.hGap4,
              SvgPicture.asset(AppImages.icon_train_detail_arrow_bottom),
              Expanded(
                child: Align(
                  alignment: Alignment.topRight,
                  child: Text(
                    '${controller.startTime}-${controller.endTime}',
                    style: TextStyle(
                      color: const Color(0xFFA0A7B5),
                      fontSize: 12.sp,
                      fontWeight: FontWeight.w400,
                    ),
                  ),
                ),
              )
            ],
          ).clickOnce(controller.selectProgramType),
          AnimatedContainer(
            duration: const Duration(milliseconds: 500),
            child: Column(
              children: [
                AppGaps.vGap6,
                Row(
                  children: [
                    Text(
                      '计划进度',
                      style: TextStyle(
                        color: const Color(0xFF495061),
                        fontSize: 12.sp,
                        fontWeight: FontWeight.w400,
                      ),
                    ),
                    const Spacer(),
                    Text(
                      '${(controller.progress * 100).toInt()}%',
                      style: TextStyle(
                        color: const Color(0xFF5C6DFF),
                        fontSize: 13.sp,
                        fontWeight: FontWeight.w400,
                      ),
                    ),
                  ],
                ),
                AppGaps.vGap6,
                //0~1比例
                CustomProgressBar(
                  // percentage: 0.45,
                  percentage: controller.progress,
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

class StickyHeader extends SliverPersistentHeaderDelegate {
  StickyHeader(
    this.child,
  );

  final Widget child;

  @override
  Widget build(BuildContext context, double shrinkOffset, bool overlapsContent) {
    return child;
  }

  @override
  double get maxExtent => 50.0;

  @override
  double get minExtent => 50.0;

  @override
  bool shouldRebuild(SliverPersistentHeaderDelegate oldDelegate) {
    return false;
  }
}
